ie已死但是使用ie的人没有
1.项目主要版本配置
vue2.*
vueCli3*及以后
Babel > 7.4.0 (babel/polyfill 版本小于7.4的可自行搜索其余教程,可参考babel官网)
2.适配主要操作
2.1、查看自己项目'package.json'里是否已经下载了'core-js'和'regenerator-runtime'依赖,如若未下载,自行下载(这里提供npm下载方式)
npm i regenerator-runtime --save
npm i core-js --save
![1.png](https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/0effa8c2de904296bf4a42988142df38~tplv-k3u1fbpfcp-jj-mark:3024:0:0:0:q75.awebp#?w=970&h=676&s=73007&e=png&b=191919)
2.2、在入口文件 'main.js' 中引入(注意:如果core-js3.*以前版本则只需 import "core-js"即可)
import "core-js/stable"
import "regenerator-runtime/runtime"
![2.png](https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/57405f4144034c5f9f1803448564d134~tplv-k3u1fbpfcp-jj-mark:3024:0:0:0:q75.awebp#?w=1002&h=456&s=50870&e=png&b=181818)
2.3、配置 'babel.config.js'
module.exports = {
presets: [
[
"@vue/cli-plugin-babel/preset",
{
useBuiltIns: "entry",
},
],
],
}
2.4、配置.browserslistrc文件(或者package.json】配置browserslist)
> 1%
last 2 versions
not ie < 11
![3.png](https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/38f86b5e63dd440382c33f723a6e05d9~tplv-k3u1fbpfcp-jj-mark:3024:0:0:0:q75.awebp#?w=996&h=257&s=15928&e=png&b=191919)
2.5、在 'index.html'中引入proxy.min.js
1、直接CDN引入
2、下载本地引入
2.6、配置'vue.config.js' (这一步比较重要,但也很简单默认配置里就有)
const { defineConfig } = require("@vue/cli-service")
module.exports = defineConfig({
// 默认情况下 babel-loader 会忽略所有 node_modules 中的⽂件。
// 如果你想要通过 Babel 显式转译⼀个依赖,可以在这个选项中列出来
//以下两种配置都行
// transpileDependencies: ['element-ui']
transpileDependencies: true,
})
3.完成第2步所有配置后启动项目--在ie中运行(不出意外的话ok了)
![4.png](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/b7ffd04bf83a4ea7891fe3e3f5b9ebdb~tplv-k3u1fbpfcp-jj-mark:3024:0:0:0:q75.awebp#?w=1899&h=1094&s=1816888&e=png&b=fcfafa)
|